<script setup>

</script>

<template>
    <div class="gg">
        <el-popover ref="popover" placement="right" title="Title" :width="200" trigger="focus"
            style="margin-left: 10px;" content="假设全部是鸡，计算脚的总数，与实际脚数进行比较，差值除以2即为兔子的数量，总头数减去兔子的数量即为鸡的数量‌
">
            <template #reference>
                <el-button class="m-2">假设法</el-button>
            </template>
        </el-popover>
        <el-popover ref="popover" placement="right" title="Title" :width="200" trigger="focus" content="通过列表的方式逐步尝试和调整，直到找到符合条件的鸡和兔的数量‌
1
5
。
这些方法各有优缺点，适用于不同的场景和需求。假设法和公式法适合快速计算，而方程法和抬脚法则更直观易懂。图示法和列表法则适合于直观理解和教学。

">
            <template #reference>
                <el-button class="m-2">列表法‌</el-button>
            </template>
        </el-popover>
        <el-popover ref="popover" placement="right" title="Title" :width="200" trigger="focus" content="兔的脚数×总只数 - 总脚数 ÷ (兔的脚数 - 鸡的脚数) = 鸡的数量，总只数 - 鸡的数量 = 兔的数量。
">
            <template #reference>
                <el-button class="m-2">公式法‌</el-button>
            </template>
        </el-popover>
        <el-popover ref="popover" placement="right" title="Title" :width="200" trigger="focus" content="让鸡和兔子都抬起一只脚，剩下的脚的数量除以2即为兔子的数量；或者让鸡和兔子都抬起两只脚，剩下的脚的数量除以2即为鸡的数量‌

">
            <template #reference>
                <el-button class="m-2">抬脚法</el-button>
            </template>
        </el-popover>
        <el-popover ref="popover" placement="right" title="Title" :width="200" trigger="focus" content="通过画图来表示鸡和兔子的数量关系，直观地解决问题‌

">
            <template #reference>
                <el-button class="m-2">‌图示法</el-button>
            </template>
        </el-popover>
    </div>
</template>

<style scoped>
.gg {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background-image: url("../../public/c85b45f5-e42b-40b1-b043-d4b94da86892.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
}

.el-button+.el-button {
    margin-left: 0px;
    background-color: rgba(0, 0, 0, 0.5);
    color: aliceblue;
}

.el-button {
    background-color: rgba(0, 0, 0, 0.5);
    color: aliceblue;
}
</style>